<!-- 企业服务-查询 -->
<template>
    <div class="service-search-contain">
        <Header></Header>
        <div class="nav-logo">
            <img src="../../assets/logo/logo-login.png" class="inline-block mr10">
            <span class="titils inline-block ml20 pl20 border-l fs24 black">
				企业服务
			</span>
        </div>
        <div class="content-contain mt40 mb40">
            <div class="container pb30 white-bg flex-column-center">
                <ul class="form-contain">
                    <li class="mb20">
                        <el-input v-model="ruleForm.code" placeholder="请输入" class="form-item"></el-input>
                        <el-button type="primary" @click="searchResult" size="large" class="ml10" style="height: 48px">查询</el-button>
                    </li>
                    <div class="text-center mt40" v-if="result">
                        <template v-if="status == 1">
                            <div class="status-content">
                                <img src="../../assets/image/enterprise/wait.png" alt="wait">
                                <p class="text-green fs22 mb20">您的申请正在审核中</p>
                            </div>
                        </template>
                        <template v-if="status == 2">
                            <div class="status-content">
                                <img src="../../assets/image/enterprise/pass.png" alt="pass">
                                <p class="text-green fs22 mb20">恭喜您，申请已通过</p>
                            </div>
                        </template>
                        <template v-if="status == -1">
                            <div class="status-content">
                                <img src="../../assets/image/enterprise/fail.png" alt="pass">
                                <p class="text-red fs22 mb20">很抱歉，您的申请未通过</p>
                                <el-button type="primary" @click="routerLink('/service-apply')" class="mt30">重新申请</el-button>
                            </div>
                        </template>
                    </div>
                    <div v-if="status!=-2 && !result">
                        暂无相关数据
                    </div>
                </ul>
            </div>
        </div>
        <Footer></Footer>
    </div>
</template>

<script>
import Header from '@/views/components/header/header'
import Footer from '@/views/components/header/footer'
import {changePw, serviceApplySearch} from '@/api/enterprise'
import {getAccountById} from "@/api/enterprise";
import {checkCode, sendValidCode} from "@/api/register";
import {checkResponse} from "@/utils";

export default {
    name: 'ForgetPassword',
    components: {
        Header,
        Footer
    },
    data() {
        return {
            result: null,
            ruleForm: {
                code: this.$route.query.serverNo ? this.$route.query.serverNo : '',
            },
            status: -2
        }
    },
    created() {
        if (this.$route.query.serverNo) {
            this.searchResult()
        }
    },
    methods: {
        searchResult() {
            serviceApplySearch(this.ruleForm.code).then(res=>{
                this.result = res.datas;
                if (res.datas) {
                    this.status = res.datas.state;
                }else{
                    this.status = 0;
                }
            });
            // this.result = 1;
        }
    }
}
</script>

<style lang="scss">
@import url('../../assets/styles/enterprise/common.css');

.service-search-contain {
    .status-content{
        p{
            margin-top: 15px;
        }
    }
    .border {
        border: 1px solid #3DABC4;
        color: #3DABC4;
    }

    .c777 {
        color: #777;
    }

    .green {
        color: #5EA08E;
    }

    .fs75 {
        font-size: 75px;
    }

    .steps-contain {
        width: 500px;
        margin-left: 145px;
    }

    .form-contain {
        margin-top: 75px;
        height: 270px;

        li {
            display: flex;
            align-items: center;
        }

        .form-item {
            width: 340px;
        }
    }

    .tips-text {
        color: #9F9F9F;
    }

    .el-step__head.is-success {
        color: #5EA08E;
        border-color: #5EA08E;

        .el-step__icon {
            background: #5EA08E;
        }

        .el-step__icon-inner {
            color: #fff;
        }
    }

    .el-step__title.is-success {
        color: #5EA08E;
    }

    .el-step__head.is-process {
        color: #fff;
        border-color: #9A9A9A;
    }

    .el-step__title.is-process {
        color: #9A9A9A;
        font-weight: 400;
    }

    .el-step__head.is-wait {
        color: #fff;
        border-color: #9A9A9A;
    }

    .el-step__title.is-wait {
        color: #9A9A9A;
    }

    .el-step__icon {
        background: #9A9A9A;
    }

    .el-step__main {
        position: relative;
        left: -23px;
    }

    .code-contain {
        position: relative;

        .code-btn {
            width: 100px;
            height: 48px;
            line-height: 48px;
            position: absolute;
            top: 0;
            right: 0;
        }
    }


    .el-input--medium .el-input__inner {
        height: 48px;
        line-height: 48px;
    }

    .nav {
        background: #f5f5f5;

        .nav-left {
            display: none;
        }
    }

    .nav_conter {
        display: none !important;
    }

    .nav-logo {
        width: 1200px;
        margin: 0 auto;
        padding-top: 50px;
    }

    .content-contain {
        min-height: calc(100vh - 355px)
    }

    .container {
        width: 780px;
        height: 480px;
        margin: 0 auto;
        padding-top: 0;
        padding-left: 150px;
        padding-right: 150px;
        box-shadow: 10px 10px 15px #ECECEC;

        .auxiliary-text {
            color: #999999;
            vertical-align: bottom;
        }

        .nex-btns {
            width: 340px;
            margin: 0 auto;
        }

        .error-text {
            height: 20px;
        }
    }
}

</style>
